<template>
	<view class="zxc_centent">
		<!-- #ifdef MP-WEIXIN || APP-PLUS -->
		<u-navbar title=" " bgColor="#D2ECDA" :placeholder="true" :border="false" leftIcon=" "
			:titleStyle="{ color: '#FFF', fontSize: '32rpx' }"></u-navbar>
		<!-- #endif -->
		<view class="tp_view">
			<image src="/static/images/mybd.png" class="mybd_img"></image>
			<view class="tp">
				<view class="tp_left">
					<image :src="headimgurl" class="tou_img"></image>
					<text>{{customerName}}</text>
				</view>
				<navigator class="tp_right" hover-class="none" url="/pagesA/set/index">
					<image src="../../static/images/set.png" mode="widthFix" style="width: 40upx;"></image>
				</navigator>
			</view>
		</view>
		<!-- end -->
		<view class="igh">
			<!-- <navigator class="igh_sm" hover-class="none" url="/pagesA/my/follow">
				<view class="igh_sm_num">6</view>
				<view class="igh_sm_text">收藏</view>
			</navigator> -->
			<view class="igh_sm" hover-class="none" @click="aaa">
				<view class="igh_sm_num">6</view>
				<view class="igh_sm_text">优惠券</view>
			</view>
			<navigator class="igh_sm" hover-class="none" url="/pagesA/coupon/index">
				<view class="igh_sm_num">6</view>
				<view class="igh_sm_text">优惠券</view>
			</navigator>
			<navigator class="igh_sm" hover-class="none" url="/pagesA/membershipCard/membershipCard">
				<view class="igh_sm_num">6</view>
				<view class="igh_sm_text">会员卡</view>
			</navigator>
			<navigator class="igh_sm" hover-class="none" url="/pagesA/my/my_integral">
				<view class="igh_sm_num">6</view>
				<view class="igh_sm_text">积分</view>
			</navigator>
		</view>
		<!-- end -->
		<view class="pol">
			<image src="/static/images/pol.png" class="pol_img"></image>
			<view class="pol_left">
				<view class="pol_tit">会员卡总余额（元)</view>
				<view class="pol_text">300.00</view>
			</view>
			<!-- 	<navigator class="pol_right" hover-class="none" url="/pagesA/my/recharge">
				立即充值
			</navigator> -->
			<navigator class="pol_right" hover-class="none" url="/pagesA/my/bill">
				账单明细
			</navigator>
		</view>
		<!-- end -->
		<view class="info">
			<view class="kmj">
				<!-- <navigator url="/pagesA/my/recruit" hover-class="none" class="kmj_sm">
							<view class="kmj_sm_left">
								<image src="../../static/images/pol1.png" mode="widthFix"></image>
								技师招募
							</view>
							<view class="kmj_sm_right">
								<image src="../../static/images/right.png" mode="widthFix"></image>
							</view>
			</navigator> -->
				<!-- 提交招募信息后显示 -->
				<!-- <navigator url="/pagesA/my/Technician_review" hover-class="none" class="kmj_sm">
							<view class="kmj_sm_left">
								<image src="../../static/images/pol1.png" mode="widthFix"></image>
								技师审核
							</view>
							<view class="kmj_sm_right">
								<image src="../../static/images/right.png" mode="widthFix"></image>
							</view>
			</navigator> -->
				<view class="kmj_sm" @click="memberClick">
					<view class="kmj_sm_left">
						<image src="../../static/images/pol3.png" mode="widthFix"></image>
						会员卡充值
					</view>
					<view class="kmj_sm_right">
						<image src="../../static/images/right.png" mode="widthFix"></image>
					</view>
				</view>
				<navigator url="/pagesA/complain/set" hover-class="none" class="kmj_sm">
					<view class="kmj_sm_left">
						<image src="../../static/images/pol2.png" mode="widthFix"></image>
						投诉管理
					</view>
					<view class="kmj_sm_right">
						<image src="../../static/images/right.png" mode="widthFix"></image>
					</view>
				</navigator>
				<navigator url="/pagesA/my/feedback" hover-class="none" class="kmj_sm">
					<view class="kmj_sm_left">
						<image src="../../static/images/pol3.png" mode="widthFix"></image>
						意见反馈
					</view>
					<view class="kmj_sm_right">
						<image src="../../static/images/right.png" mode="widthFix"></image>
					</view>
				</navigator>
				<!-- 			<navigator url="" hover-class="none" class="kmj_sm">
							<view class="kmj_sm_left">
								<image src="../../static/images/pol4.png" mode="widthFix"></image>
								联系客服
							</view>
							<view class="kmj_sm_right">
								<text style="margin-right: 15upx;">400-952 8888</text>
								<image src="../../static/images/right.png" mode="widthFix"></image>
							</view>
			</navigator> -->
				<navigator url="/pagesA/my/about" hover-class="none" class="kmj_sm">
					<view class="kmj_sm_left">
						<image src="../../static/images/pol5.png" mode="widthFix"></image>
						关于我们
					</view>
					<view class="kmj_sm_right">
						<image src="../../static/images/right.png" mode="widthFix"></image>
					</view>
				</navigator>
			</view>
		</view>
		<!-- end -->


	</view>
</template>

<script>
	export default {
		data() {
			return {
				value1: 3, //tarbar
				customerName: '用户名',
				headimgurl: '', // 用户头像
				pageNum: 1,
				pageSize: 20,
				memberCard:''
			}
		},
		onLoad() {
			this.customerName = uni.getStorageSync('customerName')
			this.headimgurl = uni.getStorageSync('headimgurl')
		},
		methods: {
			aaa(){
				uni.scanCode({
					success: function(res) {
						console.log('条码类型：' + res.scanType);
						console.log('条码内容：' + res.result);
					}
				});
			},
			change(index) {
				console.log(index)
				this.value = index;
				if (this.value == 0) {
					uni.reLaunch({
						url: '/pages/index/index'
					})
				}
				if (this.value == 1) {
					uni.reLaunch({
						url: '/pages/item/index'
					})
				}
				if (this.value == 2) {
					uni.reLaunch({
						url: '/pages/order/index'
					})
				}
				if (this.value == 3) {
					uni.reLaunch({
						url: '/pagesA/my/index'
					})
				}
			},
			memberClick(){
				let customerId = uni.getStorageSync('customerId')
				let bossld = uni.getStorageSync('bossId')
				this.$get(this.$api.memberCardList, {
						customerId,
						bossld,
						pageNum:this.pageNum,
						pageSize:this.pageSize
					},
					(res) => {
						let data = [...res.data]
						if(res.data.length>1){
							uni.navigateTo({
								url:'/pagesA/membershipCard/membershipCard',
							})
						}else if(res.data.length == 1){
							uni.navigateTo({
								url:'/pagesA/my/recharge',
								success: function(res) {
									res.eventChannel.emit('data', { data: data })
								}
							})
						}
					}, (res) => {
						uni.showToast({
							title: res.msg ? res.msg : '网络错误',
							icon: 'none'
						});
				}, 1, 0)
			}
		},
	}
</script>

<style lang="scss">
	.zxc_centent {
		padding: 0 0 80upx 0;
	}

	.tp_view {
		width: 100%;
		height: 300upx;
		display: flex;
		align-items: center;
		justify-content: center;
		/* #ifdef APP-PLUS || MP-WEIXIN*/
		margin-top: -80upx;
		/* #endif */
		position: relative;
		z-index: 22;
	}

	.tp {
		width: 90%;
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-top: -60upx;
		z-index: 22;
		position: relative;
	}

	.mybd_img {
		width: 100%;
		height: 300upx;
		position: absolute;
		left: 0;
		top: 0;
		z-index: 1;
	}

	.tp_left {
		display: flex;
		align-items: center;
	}

	.tou_img {
		width: 120upx;
		height: 120upx;
		border-radius: 120upx;
		margin-right: 30upx;
	}

	.igh {
		width: 90%;
		margin: -80upx auto 0;
		display: flex;
		align-items: center;
		justify-content: space-around;
		border-radius: 10upx;
		background-color: #fff;
		font-size: 28upx;
		padding: 30upx 0 80upx;
		z-index: 22;
		position: relative;
	}

	.igh_sm {
		text-align: center;
	}

	.igh_sm_num {
		font-weight: 700;
		font-size: 35upx;
		margin-bottom: 5upx;
	}

	.pol {
		width: 520upx;
		padding: 0 50upx;
		height: 200upx;
		margin: -50upx auto 0;
		font-size: 28upx;
		color: #fff;
		display: flex;
		align-items: center;
		justify-content: space-between;
		z-index: 22;
		position: relative;
	}

	.pol_img {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 200upx;
		z-index: 1;
	}

	.pol_text {
		font-weight: 700;
		margin-top: 10upx;
		font-size: 40upx;
	}

	.pol_left {
		position: relative;
		z-index: 22;
	}

	.pol_right {
		width: 180upx;
		height: 60upx;
		display: flex;
		align-items: center;
		justify-content: center;
		background-image: linear-gradient(to right, #fff, #08ea72);
		color: #07c160;
		border-radius: 100upx;
		font-size: 26upx;
		position: relative;
		z-index: 22;
	}

	.info {
		font-size: 28upx;
		padding: 10upx 30upx;
		width: 83%;
		margin: 30upx auto;
		background-color: #fff;
		border-radius: 10upx;
	}

	.kmj_sm {
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 25rpx 0;
	}

	.kmj_sm_left {
		display: flex;
		align-items: center;
	}

	.kmj_sm_left image {
		width: 35upx;
		margin-right: 20upx;
	}

	.kmj_sm_right {
		display: flex;
		align-items: center;
	}

	.kmj_sm_right image {
		width: 15upx;
	}

	.bt {
		width: 90%;
		margin: 0 auto;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.bt_sm {
		width: 40%;
		padding: 30upx;
		background-color: #fff;
		border-radius: 10upx;
		font-size: 24upx;
		color: #999;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}

	.bt_sm_tit {
		color: #000;
		margin-bottom: 10upx;
		font-size: 28upx;
		font-weight: 700;
	}

	.bt_sm_text {
		white-space: nowrap;
	}
</style>